console.log $
body = $(document.body)
header = $(document.head)
header.append "<style>.tucao_slice_hl{border: 1px solid #f00;}</slice>"
cur_capture = null
hl_css = "tucao_slice_hl"
image_porxy = "#{ if window.location.hostname == "localhost" then "" else "http://tucao.in"}/api/fetch_image/"
st = (e)->
  target = $(e.target)
  cur_capture = target
  target.toggleClass(hl_css)
  e.stopPropagation()
et = (e)->
  target = $(e.target)
  cur_capture = null
  target.removeClass(hl_css)
  e.stopPropagation()

$ ()-> #On load
  body.keydown((e)->
    if e.ctrlKey
      body.on("mouseover", st).on("mouseout", et)
    if e.altKey and cur_capture
      cur_capture.removeClass(hl_css) if cur_capture.hasClass(hl_css)
      window.g = html2canvas(cur_capture,{
        proxy: image_porxy,
        onrendered: (canvas)->
          window.open canvas.toDataURL()
      })
  ).keyup((e)->
    if e.ctrlKey
      body.off("mouseover", st).off("mouseout", et)
  )
